<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<jsp:include page="/WEB-INF/jsp/common/include_easyui.jsp"></jsp:include>

<style>
.west {
	width: 200px;
	padding: 10px;
}

.footer {
	text-align: center;
	color: #15428B;
	margin: 0px;
	padding: 0px;
	line-height: 23px;
	font-weight: bold;
}
</style>
</head>

<body class="easyui-layout" style="overflow-y: hidden" scroll="no">
	<div region="north" split="true" border="false"
		style="overflow: hidden; height: 30px; background: url(images/layout-browser-hd-bg.gif) #7f99be repeat-x center 50%; line-height: 20px; color: #fff; font-family: Verdana, 微软雅黑, 黑体">
		<span style="float: right; padding-right: 20px;" class="head">
			欢迎XX用户 <a href="#" id="editpass">修改密码</a> <a href="#" id="loginOut">安全退出</a>
		</span>
		<span style="padding-left: 10px; font-size: 16px;"><img
				src="images/blocks.gif" width="20" height="20" align="absmiddle" />
			我的帐本</span>
	</div>

	<div region="center">
		<div class="easyui-tabs" fit="true"  border="false" id="tabs" tabWidth="120">
			<div title="首页" style="padding: 20px; overflow: hidden;" id="home">
				<h1>
					Welcome to using The jQuery EasyUI!
				</h1>

			</div>
		</div>
	</div>


	<div region="west" class="west" title="导航菜单" style="padding: 0px; margin: 0px;">
		<div class="easyui-accordion" data-options="fit:true">
			<c:forEach var="rowMap" items="${parentList}">
				<div title="${rowMap.text}" icon="icon-sys" style="overflow: auto;">
					<div id="div_tree_${rowMap.id}"></div>
				</div>
			</c:forEach>
			
			
		</div>
	</div>

		<div region="south" split="true" style="height: 30px; background: #D2E0F2;">
			<div class="footer">
				By 疯狂秀才 Email:bjhxl@59ibox.cn
			</div>
		</div>

		<div id=mm class="easyui-menu" style="width: 150px;">
			<div id="mm-tabclose">
				关闭
			</div>
			<div id="mm-tabcloseall">
				全部关闭
			</div>
			<div id="mm-tabcloseother">
				除此之外全部关闭
			</div>
			<div class="menu-sep"></div>
			<div id="mm-tabcloseright">
				当前页右侧全部关闭
			</div>
			<div id="mm-tabcloseleft">
				当前页左侧全部关闭
			</div>
			<div class="menu-sep"></div>
			<div id="mm-exit">
				退出
			</div>
		</div>
		<script> 
$(function(){
  //动态菜单数据
  <c:forEach var="rowMap" items="${parentList}">
  	  var id = "${rowMap.id}";  	  
	  var loadURL = "<%=path%>/mainController/loadUserMenu?parentId="+id+"";
	  //实例化树形菜单
	  jQuery("#div_tree_"+id+"").tree({
	    lines:			true,
	    url:			loadURL,	
	    onClick:		function(node){
	    	var isLeaf = 		node.isLeaf;
	    	var menu_name = 	node.text;
	    	var menu_href = 	"<%=path%>" + node.menuHref;
	    	//window.alert(menu_href);
	    	if (isLeaf == 1){
	    		addTab(menu_name,menu_href,"icon-tip");
	    	}
	    }
	  }); 
  </c:forEach>
 


  function addTab(subtitle,url,icon){
		if(!$('#tabs').tabs('exists',subtitle)){
			$('#tabs').tabs('add',{
				title:				subtitle,
				content:			'<iframe scrolling="no" frameborder="0"  src="'+url+'" style="padding-left:0px;padding-bottom:0px;width:100%;height:99%;"></iframe>',
				closable:			true,
				iconCls:			icon

			});
		}else{
			$('#tabs').tabs('select',subtitle);
		}
		tabClose();
	}
		  
		function tabClose()
		{
			/*双击关闭TAB选项卡*/
			$(".tabs-inner").dblclick(function(){
				var subtitle = $(this).children(".tabs-closable").text();
				$('#tabs').tabs('close',subtitle);
			})
			/*为选项卡绑定右键*/
			$(".tabs-inner").bind('contextmenu',function(e){
				$('#mm').menu('show', {
					left: e.pageX,
					top: e.pageY
				});
				
				var subtitle =$(this).children(".tabs-closable").text();
				
				$('#mm').data("currtab",subtitle);
				$('#tabs').tabs('select',subtitle);
				return false;
			});
		}
		//绑定右键菜单事件

		
		//关闭当前
		$('#mm-tabclose').click(function(){
			var currtab_title = $('#mm').data("currtab");
			$('#tabs').tabs('close',currtab_title);
		})
		//全部关闭
		$('#mm-tabcloseall').click(function(){	
			$('.tabs-inner span').each(function(i,n){
				var t = $(n).text();
				if (t != "首页"){
					$('#tabs').tabs('close',t);
				}
				
			});	
		});
		//关闭除当前之外的TAB
		$('#mm-tabcloseother').click(function(){
			var currtab_title = $('#mm').data("currtab");
			$('.tabs-inner span').each(function(i,n){
				var t = $(n).text();
				if (t != "首页"){
					if(t!=currtab_title)
						$('#tabs').tabs('close',t);
				}
			});	
		});
		//关闭当前右侧的TAB
		$('#mm-tabcloseright').click(function(){
			var nextall = $('.tabs-selected').nextAll();
			if(nextall.length==0){
				//msgShow('系统提示','后边没有啦~~','error');
				alert('后边没有啦~~');
				return false;
			}
			nextall.each(function(i,n){
				var t=$('a:eq(0) span',$(n)).text();
				if (t != "首页"){
					$('#tabs').tabs('close',t);
				}
			});
			return false;
		});
		//关闭当前左侧的TAB
		$('#mm-tabcloseleft').click(function(){
			var prevall = $('.tabs-selected').prevAll();
			if(prevall.length==0){
				alert('到头了，前边没有啦~~');
				return false;
			}
			prevall.each(function(i,n){
				var t=$('a:eq(0) span',$(n)).text();
				
				if (t != "首页"){
					$('#tabs').tabs('close',t);
				}
			});
			return false;
		});
		
		//退出
		$("#mm-exit").click(function(){
			$('#mm').menu('hide');
		})
});
</script>
	</body>
</html>

